import React,{ Component } from "react";

export default class Hello extends Component {
    state = {
        count: 0
    }
    increment = () => {
        // React 中 类组件的状态的更改 必须使用 setState
        // this.setState({   //  写法 一 ：是同步的
        //     count: ++this.state.count
        // })

        // 写法二：是 异步 的，因为回调函数是异步的
        // this.setState((state) => {  // 可以把 state 直接解构成 {count}
        //     // document.title = state.count
        //     return {
        //         count: ++state.count
        //     }
        // })

        // 需求：网站标题随着 count 的值 发生变化
        this.setState((state) => {  // 可以把 state 直接解构成 {count}
            document.title = state.count
            return {
                count: ++state.count
            }
        }, () => {
            // 得到最新的 参数的 值
            // document.title = this.state.count
        })
    }
    render() {
        const { count } = this.state
        return (
            <div>
                <button onClick={this.increment}> 修改数据 </button>
                <div> {count} </div>
            </div>
        )
    }
}

// export default function Hello() {
  

//     return (
//         <div>
          
//         </div>
//     )
// }